---
title: 响应式设计与自适应设计有何不同？
---

响应式设计和自适应设计都试图优化不同设备上的用户体验，针对不同的视口大小、分辨率、使用上下文、控制机制等进行调整。

响应式设计基于灵活性原则——一个可以在任何设备上看起来都不错的单一流畅网站。响应式网站使用媒体查询、灵活的网格和响应式图像来创建一种用户体验，这种体验会根据多种因素进行调整和改变。就像一个球变大或变小以适应几个不同的圆环。

自适应设计更像是渐进增强的现代定义。自适应设计不是一个灵活的设计，而是检测设备和其他功能，然后根据预定义的一组视口大小和其他特征提供适当的功能和布局。该网站检测所使用的设备类型，并为该设备提供预设的布局。与其让一个球穿过几个不同大小的圆环，不如根据圆环的大小使用几个不同的球。

这两种方法都有一些需要权衡的问题：

* 响应式设计可能非常具有挑战性，因为您本质上是使用一个单一的（尽管是响应式的）布局来适应所有情况。如何设置媒体查询断点就是一个这样的挑战。您是使用标准化的断点值吗？或者，您是使用对您的特定布局有意义的断点吗？如果该布局发生变化怎么办？
* 自适应设计通常需要用户代理嗅探或 DPI 检测等，所有这些都可能被证明是不可靠的。
